import { Component, ElementRef, ViewChild, AfterViewInit } from '@angular/core';
//导入公共依赖模块
import { ShareModule, NzMessageService } from '@app/share/share.module';
import { ws_server_url } from '../../../../../default.config';
import { Router, Route, ActivatedRoute } from '@angular/router';
import { getExcelInfo_API } from '@/api/files/index.js';
@Component({
  selector: 'app-excel',
  templateUrl: './excel.component.html',
  standalone: true,
  imports: [ShareModule],
  styleUrls: ['./excel.component.less']
})
export class ExcelComponent implements AfterViewInit {
  @ViewChild('luckysheet') luckysheet: ElementRef;
  options = [];
  queryParams: any = {};

  _window = window as any;
  constructor(
    private message: NzMessageService,
    private router: Router,
    private route: ActivatedRoute
  ) {
    console.log('excel');
  }
  ngOnInit(): void {
    this.route.queryParams.subscribe(params => {
      this.queryParams = params;
    });
  }

  ngAfterViewInit() {
    this.createSheet();
  }

  ngOnDestroy() {
    //关闭ws
    this._window.luckysheet.wsclose();
  }
  goBack() {
    this.router.navigate(['/work/workSpace']);
  }
  //初始化表格
  async createSheet() {
    let fileid = this.queryParams.id;

    // 解析luckysheet的workbook基础信息
    let { code, data } = await getExcelInfo_API({ fileid });
    if (code !== 200 || !data || !data.length) {
      this.message.create('error', '文件信息获取失败');
      this.goBack();
      return;
    }

    // 初始化表格
    var options = {
      container: 'luckysheet', //luckysheet为容器id
      ...data[0],
      allowUpdate: true,
      loadUrl: `/api/excel?fileid=${fileid}`,
      updateUrl: `${ws_server_url}?type=luckysheet&fileid=${fileid}`, // 实现传参,
      cellRightClickConfig: {
        customs: [
          {
            title: '查看单元格历史',
            onClick: async (clickEvent, event, { columnIndex, rowIndex }) => {
              // 需要执行查询操作
              // await findCellHistory();
              // cellName.value = getCellName(columnIndex, rowIndex);
              // showDrawer.value = true;
            }
          }
        ]
      },
      hook: {
        sheetActivate(index) {
          // 将点击的这个事件发送给服务端
          this._window.luckysheet.sendMessage({
            t: 'shs',
            i: null,
            v: index // 要切换到的sheet页索引
          });
        }
      }
    };

    this._window.luckysheet.create(options);
  }
}
